import { Game } from './Game';
import { SimObject } from './simulation/SimObject';
import playIconUrl from '../assets/icons/play-color.png';
import pauseIconUrl from '../assets/icons/pause-color.png';

export class UIManager {

    game: Game;

    gameWindow: HTMLElement;

    showLoadingText() {
        document.getElementById('loading').style.visibility = 'visible';
    }

    hideLoadingText() {
        document.getElementById('loading').style.visibility = 'hidden';
    }

    constructor(game: Game) {

        this.game = game;
        this.gameWindow = game.targetElement;

    }

    /**
     * Toggles the pause state of the game
     */
    togglePause() {
        this.game.isPaused = !this.game.isPaused;
        if (this.game.isPaused) {
            (document.getElementById('pause-button-icon') as HTMLImageElement).src = playIconUrl;
            document.getElementById('paused-text').style.visibility = 'visible';
        } else {
            (document.getElementById('pause-button-icon') as HTMLImageElement).src = pauseIconUrl;
            document.getElementById('paused-text').style.visibility = 'hidden';
        }
    }

    /**
     * Updates the values in the title bar
     */
    updateTitleBar(game: Game) {
        document.getElementById('city-name').innerHTML = game.city.name;
        document.getElementById('population-counter').innerHTML = String(game.city.population);

        const date = new Date();
        date.setDate(date.getDate() + game.city.simTime);
        document.getElementById('sim-time').innerHTML = date.toLocaleDateString();
    }

    /**
     * Updates the info panel with the information in the object
     */
    updateInfoPanel(object: SimObject) {
        const infoElement = document.getElementById('info-panel');
        if (object) {
            infoElement.style.visibility = 'visible';
            infoElement.innerHTML = object.toHTML();
        } else {
            infoElement.style.visibility = 'hidden';
            infoElement.innerHTML = '';
        }
    }
}
